.avatar-container{
   .avatar-image {
        img{
            width: 40px;
            @media(max-width: 400px) {
                width: 35px;
            }
            border-radius: 5px;
        }
    }

    .avatar-name {
        width: 40px;
        height: 40px;
        border-radius: 5px;
        background: #4c84ff;
        color: #fff;
        align-items: center;
        justify-content: center;
        display: flex;
        font-weight: 600;
        @media(max-width: 400px) {
            width: 35px;
            height: 35px;
        }
    } 
    cursor: pointer;
    &:hover{
        color: #4c84ff;
    }
    @media(max-width: 475px) {
        .pname {
            font-size: 14px;
            font-size: 14px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            width: 95px;
        }
    }
}

